<template>
  <div>
    <m-header>
      <h2>欢迎光临大学计算机教学网站</h2>
    </m-header>
    <m-nav>
      <ul>
        <li>首页</li>
        <li><a href="#we">我们</a></li>
        <li><a href="#course">课程</a></li>
        <li><a href="#software">软件</a></li>
        <li><a href="#link">链接</a></li>
      </ul>
    </m-nav>
    <div id="header"></div>
    <div id="we">
      <p class="Mytitle">计算机教学部医学教研室</p>
      <div>
        <p>
          &nbsp;&nbsp;我校医学类学生在校期间需修读两门计算机课程，分别为一年级秋学期的大学计算机基础D（51学时，2学分）和春学期的二级课程（68学时，3学分），均为必修课。我们提供三种二级课程供各学院选择一门修读：多媒体技术及应用、数据库技术及应用、Python语言程序设计（或C语言程序设计）。<br>
        </p>
        <p>
          &nbsp;&nbsp;除必修课程外，教学部还为大家开设人工智能、Python语言程序设计等计算机选修课程。
        </p>
      </div>
    </div>
    <div id="course">
      <p class="Mytitle">课程</p>
      <table>
        <tr>
          <td><img src="@/assets/img/lhb/img1.jpg" alt="" /></td>
          <td><img src="@/assets/img/lhb/AI_mdc.jpg" alt="" /></td>
          <td class="img3"></td>
        </tr>
        <tr>
          <td class="img4"></td>
          <td class="img5"></td>
          <td><img src="@/assets/img/lhb/C_Prg.jpg" alt="" /></td>
        </tr>
        <tr>
          <td class="img7"></td>
          <td class="img8"></td>
          <td><img src="@/assets/img/lhb/ai.jpg" alt="" /></td>
        </tr>
      </table>
    </div>
    <div id="software">
      <p class="Mytitle">常用软件下载</p>
      <table>
        <tr>
          <td>Office2010</td>
          <td>Python</td>
          <td>EndNoteX9</td>
        </tr>
        <tr>
          <td>Cuteftp</td>
          <td>Envi</td>
          <td>EndNoteX6</td>
        </tr>
        <tr>
          <td>MiniPDF阅读器</td>
          <td>WinRar</td>
          <td>FMServer</td>
        </tr>
      </table>
      <p>以上软件仅供学习使用，请勿用于商业用途。请购买正版软件，尊重知识产权。</p>
    </div>
    <div class="footer" id="link">
      <div>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421e7e056d22f327d1e7b0c9ce29b5b">河北大学</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421f4f455d22f327d1e7b0c9ce29b5b">计算机教学部</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421e7e056d22a3f6d1e79079fe29b5b">教育部</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421e7e056d22f356a557b09c7a99c406d3646">河北省教育考试院</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421e7e056d229236e53300f86bad6562d">国家自然科学基金委</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421e7e056d22f356a516b468ca88d1b203b">河北农业大学</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421fdf6489069386a45300b87">河大信箱</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421fdf6489069613e03300b86a1">网易邮箱</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421e7e056d2253161546b468aa395">百度</a>
        <a href="https://v.hbu.cn/http/77726476706e69737468656265737421e7e056d2203f6757720dc7af96">谷歌</a>
        <a href="https://v.hbu.cn/https/77726476706e69737468656265737421e7e056d229317b51300f86ba">NASA</a>
      </div>
      <div>
        Copyrights©2019. Department of Computer Teaching, Hebei University.All rights reserved.
      </div>
    </div>
  </div>
</template>

<script>
import mHeader from "@/components/lhb/index/mheader";
import mNav from "@/components/lhb/index/mnav";
export default {
  components: {
    mHeader,
    mNav,
  },
};
</script>

<style>
#header {
  background-image: url(../../../assets/img/lhb/banner.jpg);
  height: 380px;
  width: 100%;
  margin: 0px auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.Mytitle {
  color: #3598db;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

#course table {
  width: 704px;
  height: 622px;
}
#software table td{
  height: 66px;
  width: 200px;
}
td img {
  width: 300px;
  height: 200px;
}

table, table tr th, table tr td {
    border: 1px solid darkgray;
}

table { 
  margin: 0px auto;
  border-collapse: collapse;
}

tr{
  text-align: center;
}
/* 
td {
    vertical-align: -webkit-baseline-middle;
    text-align: center;
} */

#we p{
  margin: 20px;
}
#course,#software, td{
  text-align: center;
}

.footer {
  margin-bottom: 30px;
}
.footer div{
  text-align: center;
  margin: 10px;
}

#softwares tr{
  height: 66px;
}
.img3{
  background-image:url('../../../assets/img/lhb/db.jpg');
  /* background-repeat:no-repeat; */
  background-origin:border-box;
  background-size: cover;
}
.img3:hover{
  background-image:url('../../../assets/img/lhb/db-hover.jpg');
}
.img4{
  background-image:url('../../../assets/img/lhb/multimedia.jpg');
  /* background-repeat:no-repeat; */
  background-origin:border-box;
  background-size: cover;
}
.img4:hover{
  background-image:url('../../../assets/img/lhb/multimedia-hover.jpg');
}
.img5{
  background-image:url('../../../assets/img/lhb/cc02.jpg');
  /* background-repeat:no-repeat; */
  background-origin:border-box;
  background-size: cover;
}
.img5:hover{
  background-image:url('../../../assets/img/lhb/cc02-hover.jpg');
}
.img7{
  background-image:url('../../../assets/img/lhb/python.jpg');
  /* background-repeat:no-repeat; */
  background-origin:border-box;
  background-size: cover;
}
.img7:hover{
  background-image:url('../../../assets/img/lhb/python-hover.jpg');
}
.img8{
  background-image:url('../../../assets/img/lhb/sky.jpg');
  /* background-repeat:no-repeat; */
  background-origin:border-box;
  background-size: cover;
}
.img8:hover{
  background-image:url('../../../assets/img/lhb/sky-hover.jpg');
}
</style>